/*
 * layui的初始化模块可以理解为，引入这个模块的js文件
 * 值得注意的是：layui的模块之间存在依赖关系，例如引入了table模块，它会layui/lay/moudules/table.js
 * 这个文件引入进来，并且它还会将这个模块所依赖的其他模块自动加入进来，
 * 实际引入的模块有：table、form、jquery、layer、laypage、laytpl、util，7个js文件
 * 所以我仅仅初始化了table模块，却能获得form、jquery、layer的模块对象
 */
//layui初始化表格模组
layui.use(['element','table','form', 'upload', 'layer'], function(){
  //获得模块对象
	var $ = layui.jquery
	, table = layui.table
	, form = layui.form
	,layer = layui.layer
	,element = layui.element;
  
  
//辅助档案数据表格渲染
  table.render({
    elem: '#subsetTable'
    ,url:'base/subset/subsets'
    ,method: 'get'
    ,where: {status:'1'} // 你额外要携带数据，以键值对的方式存入
    ,toolbar: '#recordToolbar' // 开启头部工具栏，并为其绑定左侧模板
    ,cellMinWidth: 80 // 全局定义所有常规单元格的最小宽度（默认：60）
    ,cols: [[
      {type:'numbers'} // 序号
      ,{type: 'checkbox'} // 复选框
      //,{field:'subsetId', title:'辅助档案ID',sort: true,unresize: true}
      ,{field:'archivesName', title:'参考的基础档案名',sort: true, style:'background-color: #3c8dbc; color: #fff;'}
      ,{field:'subsetName', title:'辅助档案名'}
      ,{field:'description', title: '描述'}
      ,{field:'createTime', title: '创建时间',sort: true,templet: "<div>{{layui.util.toDateString(d.createTime, 'yyyy-MM-dd HH:mm:ss')}}</div>"}
      ,{fixed: 'right', align: 'center', title:'是否可用', width:100, templet: '#checkboxTpl', unresize: true}
      //,{fixed: 'right', align: 'center', title:'操作', width:120, toolbar: '#subsetBar', unresize: true}
    ]]
    ,page: true // 开启分页
    ,limit: 10 // 每页显示的条数
    ,limits: [5,10,20,50,100] // 每页条数的选择项
    ,loading: true // 是否显示加载条(切换分页的时候显示）
    ,title: '辅助档案数据表' // 定义 table 的大标题（在文件导出等地方会用到）
    //,id: 'resourceTable' // 设定容器唯一 id
    //,skin:'row'
    ,even: false // 隔行变色
  });
  
	
	//头部搜索框  
	form.on('submit(subsetSearchBtn)', function(data) {
		console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
		console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
		console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
		//执行后台代码
		
		//刷新数据表格
		table.reload('subsetTable', {//执行重载
			url : 'base/subset/subsets',
			where:{
				subsetName:$("#subsetNameSearch").val(),
				archivesName:$("#archivesNameSearch").val(),
				useable:$("#useableSearch").val(),
			},
			page: {
				    curr: 1 //重新从第 1 页开始
				  }
			,limit:10
			
		});
		return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
	});

/*--------------------------------------------------------------------------------*/
	  //检查项目添加到下拉框中
	 $.ajax({
		  url: 'base/archives/archive/N',
		  dataType: 'json',
		  type: 'GET',
		  success: function (data) {
			  $.each(data, function (index, item) {
			  $('#archivesId').append(new Option(item.archivesName, item.archivesId));// 下拉菜单里添加元素
		  });
		  layui.form.render("select");
		
		  //重新渲染 固定写法
		  }
	   });
/*-------------------------------------------------------------------------------*/
	
	//头工具栏事件
	table.on('toolbar(subsetTableEvent)', function(obj) {
		//获取当前表格选中状态和选中的数据
		var checkStatus = table.checkStatus(obj.config.id);
		//区分点击的按钮
		switch (obj.event) {
		case 'addRecord':
			//弹出新增模态框
			initAddSubsetModel();
			break;
		case 'updateRecord':
			//选择的数据数量
			if (checkStatus.data.length > 1) {
				layer.msg( "最多只能修改一行数据哦！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			} else if (checkStatus.data.length < 1) {
				layer.msg( "请选择要修改的数据！！", {
					icon : 1, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			}else if (checkStatus.data[0].useable == "N") {
				layer.msg( "该用户已被禁用！！", {
					icon : 1, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			} else {
				//弹出修改模态框，传递当前选中的一行数据过去
				initUpdateSubsetModel(checkStatus.data[0]);
			}
			break;
		case 'frozenRecord':
			//当前选中行的数据
			var data = checkStatus.data;
			//判断是否选择了数据
			if (checkStatus.data.length < 1) {
				layer.msg( "请选择要禁用的档案！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500
				//2秒关闭（如果不配置，默认是3秒）
				});
			}
			//定义一个要删除的所有资源ID的字符串
			var subsetIdStr = "";
			//遍历传递过来的要删除的数据
			for (var i = 0; i < data.length; i++) {
				if (data[i].useable == "N") {
					layer.msg( "所选数据中有禁用的！！", {
						icon : 1, //图标，可输入范围0~6
						time : 2500
					//2秒关闭（如果不配置，默认是3秒）
					});
					return;
				}
				//拿出资源ID进行拼接
				subsetIdStr += data[i].subsetId + ",";
			}
			//截取掉因为拼接产生的多余的一个逗号
			subsetIdStr = subsetIdStr.substring(0, subsetIdStr.length - 1);
			
			frozenORrecoverSubset(subsetIdStr, "N");
			break;
		case 'recoverRecord':
			//当前选中行的数据
			var data = checkStatus.data;
			//判断是否选择了数据
			if (checkStatus.data.length < 1) {
				layer.msg( "请选择要还原的档案！！", {
					icon : 4, //图标，可输入范围0~6
					time : 2500//2秒关闭（如果不配置，默认是3秒）
				});
			}
			//定义一个要删除的所有资源ID的字符串
			var subsetIdStr = "";
			//遍历传递过来的要删除的数据
			for (var i = 0; i < data.length; i++) {
				if (data[i].useable == "Y") {
					layer.msg( "所选档案中有可用的！！", {
						icon : 1, //图标，可输入范围0~6
						time : 2500//2秒关闭（如果不配置，默认是3秒）
					});
					return;
				}
				//拿出资源ID进行拼接
				subsetIdStr += data[i].subsetId + ",";
			}
			//截取掉因为拼接产生的多余的一个逗号
			subsetIdStr = subsetIdStr.substring(0, subsetIdStr.length - 1);
			
			frozenORrecoverSubset(subsetIdStr, "Y");
			break;
		};
	});

	//监听工具条 
	table.on('tool(subsetTableEvent)', function(obj) {
		var data = obj.data; //获得当前行数据
		var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
		if (layEvent === 'del') { //删除
			layer.confirm('确认删除吗？', function(index) {
				//把当前要删除的数据放入数组，因为删除方法要的是一个数组对象
				var objArray = new Array(data);
				//调用删除方法，传递要删除的行的数据
				frozenRecord(objArray);
				//关闭当前页面
				layer.close(index);
			});
		} else if (layEvent === 'edit') { //编辑
			//弹出修改模态框，传递当前选中的一行数据过去
			initUpdateSubsetModel(data);
		}
	});
	
	

	//监听锁定操作
	form.on('switch(useable)', function(obj) {
		frozenORrecoverSubset(obj.value, this.checked == true ? "Y" : "N");
	});

	//关闭模态框 新增和修改模态框共用这个点击事件
	$(".modalClose").click(function() {
		//关闭页面上所有类型的所有弹框
		layer.closeAll();
	});

	
	
	var frozenORrecoverSubset = function(subsetIdStr, status){
		//基础档案ID
		var subsetId = subsetIdStr;
		//定义提示信息, 状态
		var msg, useable;
		if (status == "Y") {
			msg = "还原", useable = "Y";
		} else {
			msg = "禁用", useable = "N";
		}
		//发送异步请求冻结或还原资源
		$.ajax({
			async : false, //默认为true，false表示同步，如果当前请求没有返回则不执行后续代码
			type : "post",
			url : 'base/subset/subset/'+subsetId+"/"+useable,
			data : {
				_method: 'DELETE'
			},
			datatype : 'json',
			success : function(result) {
				if (result == "success") {
					layer.msg(msg + "成功！", {
						icon : 1, //图标，可输入范围0~6
						time : 2500
					//2秒关闭（如果不配置，默认是3秒）
					});
				} else {
					layer.msg(msg + "失败！", {
						icon : 2,
						time : 2500
					});
				}
				//刷新数据表格
				table.reload('subsetTable', {
					url : 'base/subset/subsets'
				});
			}
		});
	}

	//初始化新增模态框
	var initAddSubsetModel = function() {
		//弹出一个页面层
		openModal({ //弹模态框调用方法模板（修改值即可）
			type: 1, // 基本层类型0~4，1为页面层
			title: '添加辅助档案', // 标题
			width: '500px', // 宽度
			height: '400px', // 高度
			modalId: 'addSubsetModel', // 模态框id不用加 # 符号
			anim: 0, // 弹出动画
			resize: false, // 是否允许拉伸
			btnAlign: 'c', // 按钮'c'居中...
			ajaxType: 'post', // ajax请求方式
			ajaxUrl: 'base/subset/subset', // ajax请求地址
			ajaxAsync: true, // ajax是否异步请求
			reloadTabId: 'subsetTable', // 刷新表数据的表 id 不用加 # 符号
			reloadTabUrl: 'base/subset/subsets', // 刷新表数据请求的url
			/*selectList: [{ //下拉框加载（没有可不要/删掉）
					selectId: 'archivesId', // select的 id 不用加 # 符号
					selectUrl: 'base/archives/archive/N', // select的 请求的url
					selectType: 'get', // select请求方式
					optionVal: 'orgId', // option的 value的数据字段
					optionTxt: 'orgName' // soption的请求的内容字段
				},
				{
					selectId: 'subsetName', // select的 id 不用加 # 符号
					selectUrl: 'sys/org/selectList', // select的 请求的url
					selectType: 'get', // select请求方式
					optionVal: 'subsetId', // option的 value的数据字段
					optionTxt: 'subsetName' // soption的请求的内容字段
				},
				{
					selectId: 'staffName', // select的 id 不用加 # 符号
					selectUrl: 'sys/org/selectList', // select的 请求的url
					selectType: 'get', // select请求方式
					optionVal: 'staffId', // option的 value的数据字段
					optionTxt: 'staffName' // soption的请求的内容字段
				}
			],*/
			ifOk: {
				funName: addSubsetOk, // 提交成功回调函数名（不能是数字和字符串也不能带括号，有模板函数fun1/自定义）
				parameter: {} // 传入提交成功回调函数的参数json
			},
			ifErr: {
				funName: addSubsetErr, // 提交失败回调函数名（不能是数字和字符串也不能带括号，有模板函数fun2/自定义）
				parameter: {} // 传入提交失败回调函数的参数json
			},
			modalFormVerify: { // 校验（无校验可不要/删掉,建议:写校验函数,！--注意：该上传非submit提交，layui的表单校验无效--！）
				funName: addVerify, // 校验函数名（不能是数字和字符串也不能带括号，返回值必须是true才能提交，有模板函数fun3/自定义）
				parameter: {} // 传入校验函数的参数json
			}
		})
	}

	//初始化修改模态框
	var initUpdateSubsetModel = function(data) {
		//弹出一个页面层
		openModal({ //弹模态框调用方法模板（修改值即可）
			type: 1, // 基本层类型0~4，1为页面层
			title: '修改辅助档案', // 标题
			width: '500px', // 宽度
			height: '400px', // 高度
			modalId: 'updateSubsetModel', // 模态框id不用加 # 符号
			anim: 0, // 弹出动画
			resize: false, // 是否允许拉伸
			btnAlign: 'c', // 按钮'c'居中...
			ajaxType: 'post', // ajax请求方式
			ajaxUrl: 'base/subset/subset', // ajax请求地址
			ajaxAsync: true, // ajax是否异步请求
			reloadTabId: 'subsetTable', // 刷新表数据的表 id 不用加 # 符号
			reloadTabUrl: 'base/subset/subsets', // 刷新表数据请求的url
			ifOk: {
				funName: updateSubsetOk, // 提交成功回调函数名（不能是数字和字符串也不能带括号，有模板函数fun1/自定义）
				parameter: {} // 传入提交成功回调函数的参数json
			},
			ifErr: {
				funName: updateSubsetErr, // 提交失败回调函数名（不能是数字和字符串也不能带括号，有模板函数fun2/自定义）
				parameter: {} // 传入提交失败回调函数的参数json
			},
			modalFormVerify: { // 校验（无校验可不要/删掉,建议:写校验函数,！--注意：该上传非submit提交，layui的表单校验无效--！）
				funName: updateVerify, // 校验函数名（不能是数字和字符串也不能带括号，返回值必须是true才能提交，有模板函数fun3/自定义）
				parameter: {} // 传入校验函数的参数json
			}
		});

		//表单赋值
		form.val('updateSubsetForm', {
			"subsetId" : data.subsetId
			,"subsetName" : data.subsetName
			,"archivesId" : data.archivesId
			,"archivesName" : data.archivesName
			,"useable" : data.useable
			,"description" : data.description
		});
    }
	
	/*-------------------------------------------------------*/
	//额外添加数据
	form.on('select',function(data){
		switch($(data.elem).attr('id')){
		case 'archivesId':
			$(".definedModal input[name='archivesName']").val($(data.elem).children("option[value='"+$(data.elem).val()+"']").text());
			break;
		}
	});
	// 提交成功回调函数模板
	function addSubsetOk(e) {
		if(e.respData == true) {
			layer.closeAll();
			layer.msg("添加成功", {
				icon: 1, //图标，可输入范围0~6
				time: 2500 //2秒关闭（如果不配置，默认是3秒）
			});
		} else {
			layer.msg("添加失败，请重试！", {
				icon: 1, //图标，可输入范围0~6
				time: 2500 //2秒关闭（如果不配置，默认是3秒）
			});
		}
		table.reload('subsetTable', {
			url: "base/subset/subsets"
		});
	}

	// 提交失败回调函数模板
	function addSubsetErr() {
		layer.msg("添加失败，请重试！", {
			icon: 1, //图标，可输入范围0~6
			time: 2500 //2秒关闭（如果不配置，默认是3秒）
		});
	}
	
	function updateSubsetOk(e) {
		if(e.respData == true) {
			layer.closeAll();
			layer.msg("修改成功", {
				icon: 1, //图标，可输入范围0~6
				time: 2500 //2秒关闭（如果不配置，默认是3秒）
			});
		} else {
			layer.msg("修改失败，请重试！", {
				icon: 1, //图标，可输入范围0~6
				time: 2500 //2秒关闭（如果不配置，默认是3秒）
			});
		}
		table.reload('subsetTable', {
			url: "base/subset/subsets"
		});
	}

	// 提交失败回调函数模板
	function updateSubsetErr() {
		layer.msg("修改失败，请重试！", {
			icon: 1, //图标，可输入范围0~6
			time: 2500 //2秒关闭（如果不配置，默认是3秒）
		});
	}

	// 表单校验函数模板
	function addVerify() {
		var verifyOkNum = 0; //定义校验通过数量

		//自定义校验方法（修改即可）根据元素中my-verify属性的值进行校验没有可以自己添加（跟layui的一样写法）
		myVerify({
			addSubsetName: function(value) {
				if(value == '' || value == null) {
					return '辅助档案名不能为空';
				} else if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
					return '辅助档案名不能有特殊字符';
				} else if(/(^\_)|(\__)|(\_+$)/.test(value)) {
					return '辅助档案名首尾不能出现下划线\'_\'';
				} else if(/^\d+\d+\d$/.test(value)) {
					return '辅助档案名不能全为数字';
				}
				/* else if(从数据库查组织结构名函数的返回值（组织名） != 组织结构id && 从数据库查组织结构名函数的返回值（组织名） != "") {
					return '该组织名已存在';
				}*/
				{
					verifyOkNum++;
					return null;
				}
			}
		});
		//
		if(verifyOkNum == 1) { //当校验通过数量==要校验的数量时返回true
			return true;
		} else {
			return false;
		}
	}
	
	// 表单校验函数模板
	function updateVerify() {
		var verifyOkNum = 0; //定义校验通过数量

		//自定义校验方法（修改即可）根据元素中my-verify属性的值进行校验没有可以自己添加（跟layui的一样写法）
		myVerify({
			updateSubsetName: function(value) {
				if(value == '' || value == null) {
					return '辅助档案名不能为空';
				} else if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
					return '辅助档案名不能有特殊字符';
				} else if(/(^\_)|(\__)|(\_+$)/.test(value)) {
					return '辅助档案名首尾不能出现下划线\'_\'';
				} else if(/^\d+\d+\d$/.test(value)) {
					return '辅助档案名不能全为数字';
				}
				/* else if(从数据库查组织结构名函数的返回值（组织名） != 组织结构id && 从数据库查组织结构名函数的返回值（组织名） != "") {
					return '该组织名已存在';
				}*/
				{
					verifyOkNum++;
					return null;
				}
			}
		});
		//
		if(verifyOkNum == 1) { //当校验通过数量==要校验的数量时返回true
			return true;
		} else {
			return false;
		}
	}

	/*------------------打开模态框的主方法（放在layui.use(['table'], function() {}（必须要定义了var form = layui.form,layer = layui.layer,table = layui.table,$ = layui.jquery;）里面）不能私自修改，折叠起来-------------------------------------------------------------------*/
	function openModal(modalDatas) {
		if(typeof(modalDatas.selectList) !== 'undefined') {
			loadOption(modalDatas.selectList);
		}

		layer.open({
			type: modalDatas.type, // 基本层类型0~4，1为页面层
			title: modalDatas.title, // 标题
			area: [modalDatas.width, modalDatas.height], // 宽高 只写一个参数就是表示宽度，高度会自适应
			content: $("#" + modalDatas.modalId), // 文本、html都行
			anim: modalDatas.anim, // 弹出动画
			resize: modalDatas.resize, // 是否允许拉伸
			btnAlign: modalDatas.btnAlign, //按钮居中
			btn: ['立即提交', '关闭'], //按钮文字
			btn1: function(index, layero) { //（btn1：‘立即提交’）   回调函数
				if(modalDatas.modalFormVerify != '' && typeof(modalDatas.modalFormVerify) !== 'undefined') {
					if(typeof(modalDatas.modalFormVerify.funName) === 'function' && modalDatas.modalFormVerify.funName(modalDatas.modalFormVerify.parameter) == true) {
						setModalAjaxData();
					} else {
						console.log('你的校验未通过！')
					}
				} else {
					setModalAjaxData();
				}

			},
			btn2: function(index, layero) { //（btn2：‘关闭’） 回调函数
				//关闭页面上所有类型的所有弹框
				layer.closeAll();
			},
			end: function() { // 弹出层销毁时的回调函数（不论何种方式，只要关闭了就执行）
				//清空表单
				$("#" + modalDatas.modalId + " form")[0].reset();
				if(typeof(modalDatas.selectList) !== 'undefined') {
					claseOption(modalDatas.selectList); //在''里面填要清空的select的id
				}
			}
		});

		function setModalAjaxData() {
			var formData = {};
			$.map($("#" + modalDatas.modalId + " form").serializeArray(), function(object, index) {
				formData[object['name']] = object['value'];
			});
			if(modalDatas.ajaxType == '' || typeof(modalDatas.ajaxType) === 'undefined') {
				modalDatas.ajaxType = 'post';
			}
			if(modalDatas.ajaxAsync == '' || typeof(modalDatas.ajaxAsync) === 'undefined') {
				modalDatas.ajaxAsync = true;
			}
			modalAjax({
				formData: formData,
				thisType: modalDatas.ajaxType,
				thisUrl: modalDatas.ajaxUrl,
				thisAsync: modalDatas.ajaxAsync,
				thisOkFun: {
					funName: modalDatas.ifOk.funName,
					parameter: modalDatas.ifOk.parameter
				},
				thisErrFun: {
					funName: modalDatas.ifErr.funName,
					parameter: modalDatas.ifErr.parameter
				}
			});
		}

		//提交表单函数
		function modalAjax(modalSubmitData) {
			$.ajax({
				type: modalSubmitData.thisType,
				url: modalSubmitData.thisUrl,
				async: modalSubmitData.ajaxAsync,
				data: modalSubmitData.formData,
				dataType: 'json',
				success: function(respData) {
					if(typeof(modalSubmitData.thisOkFun.funName) === 'function') {
						modalSubmitData.thisOkFun.funName({
							respData: respData,
							parameter: modalSubmitData.thisOkFun.parameter
						});
					}
				},
				error: function() {
					if(typeof(modalSubmitData.thisErrFun.funName) === 'function') {
						modalSubmitData.thisErrFun.funName(modalSubmitData.thisErrFun.parameter);
					}
				}
			});
		}

		function addOption(obj) {
			if(obj.respData != '' && typeof(obj.respData) != 'undefined') {
				$.each(obj.respData, function(index, o) {
					$("#" + modalDatas.modalId + " #" + obj.parameter.selectId).append(new Option(o[obj.parameter.optionTxt], o[obj.parameter.optionVal]));
				});
				form.render(); //渲染将option添加进去
			}
		}
		//清空select的option方法
		function claseOption(selectList) {
			if(typeof(selectList) !== 'undefined') {
				$.each(selectList, function(index, o) {
					if(o.selectId != '' && typeof(o.selectId) !== 'undefined') {
						$("#" + modalDatas.modalId + " #" + o.selectId).html("<option value=''></option>");
					}
				});
			}
		}

		function loadOptionErr() {
			layer.msg("请求超时，数据加载失败！", {
				icon: 1,
				time: 2500
			});
		}

		//清空select的option方法
		function loadOption(selectList) {
			$.each(selectList, function(index, o) {
				if(o.selectId != '' && typeof(o.selectId) != undefined) {
					if(o.selectType == '' || typeof(o.selectType) === 'undefined') {
						o.selectType = 'get';
					}
					modalAjax({
						formData: {},
						thisType: o.selectType,
						thisUrl: o.selectUrl,
						thisAsync: false,
						thisOkFun: {
							funName: addOption,
							parameter: o
						},
						thisErrFun: {
							funName: loadOptionErr
						}
					});
				}
			});
		}
	}
	/*------------------打开模态框的主方法（放在layui.use(['table'], function() {}（必须要定义了var form = layui.form,layer = layui.layer,table = layui.table,$ = layui.jquery;）里面）不能私自修改，折叠起来-------------------------------------------------------------------*/

	/*------------------自定义校验方法（调用即可，！--注意：不可私自修改--！）------------------------*/
	function myVerify(myVerifyData) { //自定义校验方法（调用即可，！--注意：折叠起来，不可私自修改--！）
		if(typeof(myVerifyData) !== 'undefined' && myVerifyData != '') {
			$.each(myVerifyData, function(name) {
				var myVerifyReturnVal = myVerifyData[name]($("input[my-verify=" + name + "]").val());
				if(myVerifyReturnVal != null && typeof(myVerifyReturnVal) !== 'undefined') {
					//"<div style='position: relative'><span style='color: red; font-size: 12px; position: absolute;'>"+$("input[my-verify=" + name + "]").val()+"</span></div>"
					$("input[my-verify=" + name + "]").css('border-color', 'rgb(255,87,34)');
					$("input[my-verify=" + name + "]").next().remove();
					$("input[my-verify=" + name + "]").parent().append("<div class='myVerifyErr' style='position: relative'><span style='color: red; font-size: 12px; position: absolute;'>" + myVerifyData[name]($("input[my-verify=" + name + "]").val()) + "</span></div>")
				}
			});
			setTimeout(removeMyVerifyErr, 2000);

			function removeMyVerifyErr() {
				$(".myVerifyErr").remove();
				$("form input[name!='button']").css('border-color', 'rgb(230,230,230)');
			}
		}
	}
  
});
